<!DOCTYPE html>
<html lang="">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Home</title>

    <script src="../public/vue/dist/vue.min.js"></script>
    <!-- Bootstrap CSS -->
    <link href="../public/bootstrap/dist/css/bootstrap.css" rel="stylesheet">
    <!-- jQuery -->
    <script src="../public/jquery/dist/jquery.min.js"></script>
    <!-- Bootstrap JavaScript -->
    <script src="../public/bootstrap/dist/js/bootstrap.min.js"></script>


    <link rel="stylesheet" href="../public/summernote/dist/summernote.css">
    <!-- <link rel="stylesheet" href="../public/summernote/dist/summernote-bs4.css"> -->

    <script src="../public/summernote/dist/summernote.js"></script>
    <script src="../public/summernote/dist/lang/summernote-zh-CN.js"></script>

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.3/html5shiv.js"></script>
    <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body>



    <div class="container" style="margin:20px auto;" id="articleDetailApp">




        <form class="navbar-form pull-right">
            <button type="button" onclick="window.close();" class="btn btn-link">返回</button>
        </form>


        <div class="clearfix">

        </div>

        <form role="form">
            <div class="form-group">
                <!-- <label for="firstname">名字</label> -->
                {{articleDetailForm.sname}}
            </div>

            <div class="form-group">
                <!-- <label for="lastname">正文</label> -->

                <textarea class="form-control" readonly id="summernote1" name="content" cols="60" rows="10" v-model="articleDetailForm.stext"></textarea>
            </div>

            <!-- <div class="form-group">
                    <div class="col-sm-offset-2 col-sm-10">
                        <button type="button" class="btn btn-default">保存</button>
                    </div>
                </div> -->
        </form>

    </div>


</body>

</html>

<script>
    var vm = new Vue({
        el: '#articleDetailApp',
        data: {
            articleDetailForm: {}
        },
        methods: {


            getQueryString(name) {
                var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
                var r = window.location.search.substr(1).match(reg);
                if (r != null) return unescape(r[2]);
                return null;
            },

            getArticle: function () {

                var _self = this;

                var _id = this.getQueryString("_id");
                $.ajax({
                    // crossDomain: true,
                    type: "get",
                    url: "../walleArticles/"+ _id,
                    // data: {
                    //     _id: _id
                    // },
                    dataType: "json",
                    success: function (response) {
                        // console.log(response);
                        if (response.code == 0) {

                            _self.articleDetailForm = response.dat;
                            $('#summernote1').summernote('code', _self.articleDetailForm.stext);
                        }

                    }
                });
            }
        },
        mounted: function () {

            var _self = this;
            $('#summernote1').summernote({
                airMode: true,
                lang: 'zh-CN',
                // placeholder: placeholder,
                minHeight: 300,
                dialogsFade: true, // Add fade effect on dialogs
                dialogsInBody: true, // Dialogs can be placed in body, not in
                // summernote.
                // disableDragAndDrop: false,// default false You can disable drag
                // and drop


            });



            this.getArticle();

            $('#summernote1').summernote('disable');
        }
    })
</script>